<!DOCTYPE html>
<html lang="en">
<head>
    <!-- 导入公共的meta -->
    <%= require('html-loader!./layout/head-common.html') %>

    <!-- 通脱抽取webpack.config.js中定义的title给每个页面的title赋值 -->
    <title><%= htmlWebpackPlugin.options.title %> -- 我的第一个非框架的前后端分离项目</title>
</head>
<body>
    <!-- 导入顶部导航 -->
    <%= require('html-loader!./layout/nav-simple.html') %>

    <!-- 通用侧边栏导航 -->
    <div class="page_wrap">
        <div class="w">
            <div class="user_con">
                <h3 class="user_title">找回密码</h3>

                <div class="user_form">
                    <div class="error_item">
                        <i class="fa fa-minus-circle error_icon"></i>
                        <p class="error_msg">Error</p>
                    </div>

                    <div class="step_con step_username">
                        <p class="user_form_item_text">用户名是：</p>
                        <div class="user_form_item">
                            <label for="username" class="user_label">
                                <i class="fa fa-user"></i>
                            </label>
                            <input type="text" class="user_input" id="username" placeholder="请输入用户名" autocomplete="off">
                        </div>
                        <a href="javascript:" class="btn btn_submit" id="submit_username">下一步</a>
                    </div>

                    <div class="step_con step_question">
                        <p class="user_form_item_text">
                            密码提示问题是：<span class="question"></span>
                        </p>
                        <div class="user_form_item">
                            <label for="question" class="user_label">
                                <i class="fa fa-key"></i>
                            </label>
                            <input type="text" class="user_input" id="answer" placeholder="请输入密码提示问题答案" autocomplete="off">
                        </div>
                        <a href="javascript:" class="btn btn_submit" id="submit_question">下一步</a>
                    </div>

                    <div class="step_con step_password">
                        <p class="user_form_item_text">请输入密码：</p>
                        <div class="user_form_item">
                            <label for="password" class="user_label">
                                <i class="fa fa-lock"></i>
                            </label>
                            <input type="password" class="user_input" id="password" placeholder="请输入新密码" autocomplete="off">
                        </div>
                        <a href="javascript:" class="btn btn_submit" id="submit_password">下一步</a>
                    </div>

                    <div class="link_item">
                        <a href="user-login.html" class="link" target="_blank">返回登录 <i class="fa fa-hand-o-right"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 导入通用footer -->
    <%= require('html-loader!./layout/footer.html') %>
</body>
</html>